<template>
  <!-- 归档信息管理页面 -->
  <div class="fielDetail">
    <!-- 头部 -->
    <div class="info-top">
      <div class="info-top-left">
        <div class="line"></div>
        <span class="fileinfo">文件信息</span>
        <div class="info-top-right">
          <!-- <el-button type="primary" class="btn-lanse"
            ><i class="el-icon-tickets el-icon--left"> 暂存</i></el-button
          > -->
          <!-- <el-button type="primary" class="btn-lanse" @click="save"
            ><i class="el-icon-circle-check el-icon--left"> 提交</i></el-button
          > -->
          <el-button @click="goBank"
            ><i class="el-icon-back el-icon--left"> 返回</i></el-button
          >
        </div>
      </div>
    </div>
    <!-- 分割线 -->
    <div class="divider">
      <el-divider></el-divider>
    </div>
    <!-- 中间 -->
    <div class="info-center">
      <span class="info-center-text">文件详细信息</span>
      <div class="treeNode">
        <el-tree
          ref="tree"
          :props="props"
          :load="loadNode"
          lazy
          highlight-current
          @node-click="getCurrentNode"
          node-key="uuid"
        >
          <div
            slot-scope="{ node, data }"
            :class="data.type == -1 ? 'onlyThreeActive' : 'onlyThree'"
          >
            <span class="tree_label" :title="node.label">{{ node.label }}</span>
          </div>
        </el-tree>
      </div>
      <div class="edit-box">
        <div class="btn-box">
          <el-button @click="handleEidt">修改</el-button>
        </div>
        <div class="btn-box">
          <el-button @click="handleDelet">删除</el-button>
        </div>
        <div class="btn-box">
          <el-button @click="handleAdd">新增</el-button>
        </div>
        <div class="btn-box">
          <el-button @click="handleChangeLevel">升降</el-button>
        </div>
      </div>
    </div>
    <!-- 修改内容弹窗 -->
    <el-dialog
      custom-class="edit-dialog-box"
      title="修改内容"
      :visible.sync="isShowEditDialog"
      width="30%"
      :append-to-body="true"
    >
      <div class="edit-dialog-content">
        <el-input
          type="textarea"
          :rows="5"
          placeholder="请输入内容"
          v-model="editVal"
          resize="none"
        >
        </el-input>
        <div class="btn-box">
          <el-button @click="handleSubmitEdit">确定</el-button>
        </div>
      </div> </el-dialog
    ><!-- 新增弹窗 -->
    <el-dialog
      custom-class="edit-dialog-box"
      title="新增内容"
      :visible.sync="isShowAddDialog"
      width="30%"
      :append-to-body="true"
    >
      <div class="edit-dialog-content">
        <div class="radio-box">
          <el-radio-group v-model="addRadio">
            <el-radio :label="1">向前新增</el-radio>
            <el-radio :label="2">向后新增</el-radio>
            <el-radio :label="3" v-show="currentData.type != -1"
              >新增正文</el-radio
            >
          </el-radio-group>
        </div>
        <el-input
          type="textarea"
          :rows="5"
          placeholder="请输入内容"
          v-model="addVal"
          resize="none"
        >
        </el-input>
        <div class="btn-box">
          <el-button @click="handleSubmitAdd">确定</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 升降级弹窗 -->
    <el-dialog
      custom-class="edit-dialog-box"
      title="修改层级结构"
      :visible.sync="isShowChangeLevelDialog"
      width="600px"
      :append-to-body="true"
    >
      <div class="edit-dialog-content">
        <el-scrollbar class="tree-scroll-box">
          <el-tree
            v-if="isShowChangeLevelDialog"
            ref="changeLevalTree"
            :props="props"
            :load="loadNodeChangeLevel"
            lazy
            highlight-current
            @node-click="getChangeCurrentNode"
            node-key="uuid"
          >
            <div
              slot-scope="{ node, data }"
              :class="data.type == -1 ? 'onlyThreeActive' : 'onlyThree'"
            >
              <span class="tree_label" :title="node.label">{{
                node.label
              }}</span>
            </div>
          </el-tree>
        </el-scrollbar>
        <div class="btn-box">
          <el-button @click="handleSubmitChangeLevel">确定</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 升级 选择顺序弹窗 -->
    <el-dialog
      custom-class="edit-dialog-box"
      title="选择插入的顺序"
      :visible.sync="isShowUpCheckOrderDialog"
      width="600px"
      :append-to-body="true"
    >
      <div class="edit-dialog-content">
        <el-scrollbar class="tree-scroll-box">
          <el-tree
            v-if="isShowUpCheckOrderDialog"
            ref="changeLevalTree"
            :props="upCheckOrderTableProps"
            :data="upCheckOrderTableData"
            highlight-current
            @node-click="getUpCheckedNode"
            node-key="uuid"
          >
            <div
              slot-scope="{ node, data }"
              :class="data.type == -1 ? 'onlyThreeActive' : 'onlyThree'"
            >
              <span class="tree_label" :title="node.label">{{
                node.label
              }}</span>
            </div>
          </el-tree>
        </el-scrollbar>
        <div class="btn-box">
          <el-button @click="handleUpSubmit">确定</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "fielDetail",
  data() {
    return {
      props: {
        label: "labelContent",
        children: "zones",
        isLeaf: "leaf",
      },
      currentData: {},
      currentNode: {},
      isShowEditDialog: false,
      editVal: "",
      isShowAddDialog: false,
      addVal: "",
      addRadio: "",
      isShowChangeLevelDialog: false,
      changeCurrentData: {},
      changeCurrentNode: {},
      isShowUpCheckOrderDialog: false,
      upCheckOrderTableProps: {
        label: "labelContent",
        isLeaf: "leaf",
      },
      upCheckOrderTableData: [],
      upCheckedNode: {},
    };
  },
  activated() {},
  mounted() {},
  destroyed() {},
  methods: {
    loadNode(node, resolve) {
      let fileType = this.$route.query.type;
      if (fileType == ".doc" || fileType == ".docx") {
        if (node.level === 0) {
          let obj = {
            file_id: this.$route.query.row,
          };
          this.$api
            .get_word_title(obj)
            .then((res) => {
              res.data.leaf = false;
              res.data.labelContent = res.data.title;
              return resolve([res.data]);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
        if (node.level >= 1) {
          let obj2 = {
            file_id: node.data.file_id,
            uuid: node.data.uuid,
          };
          this.$api
            .get_word_info(obj2)
            .then((res) => {
              let computedData = [];
              res.data.forEach((item, i) => {
                if (item.parent_id === node.data.uuid) {
                  let type = item.type == -1 ? true : false;
                  item.leaf = type;
                  item.labelContent = item.title ? item.title : item.text;
                  computedData.push(item)
                }
              });
              return resolve(computedData);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
      } else if (fileType == ".pdf") {
        if (node.level === 0) {
          let obj = {
            file_id: this.$route.query.row,
          };
          this.$api
            .get_pdf_title(obj)
            .then((res) => {
              res.data.forEach((item) => {
                let type = !item.text_flag == 1;
                item.leaf = type;
                item.labelContent = item.title;
              });
              return resolve(res.data);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
        if (node.level >= 1) {
          let obj2 = {
            file_id: node.data.file_id,
            uuid: node.data.uuid,
          };
          this.$api
            .get_pdf_info(obj2)
            .then((res) => {
              let computedData = [];
              res.data.forEach((item) => {
                if (item.parent_id === node.data.uuid) {
                  let type = item.type == -1 ? true : false;
                  item.leaf = type;
                  item.labelContent = item.title ? item.title : item.text;
                  computedData.push(item);
                }
              });
              return resolve(computedData);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
      }
    },
    group(ss, step) {
      var r = [];
      function doGroup(s) {
        if (!s) return;
        r.push(s.substr(0, step));
        s = s.substr(step);
        doGroup(s);
      }
      doGroup(ss);
      return r;
    },
    save() {
      let obj = {
        fileName: this.formLabelAlign.fileName,
        fileTime: this.formLabelAlign.fileTime,
        creator: this.formLabelAlign.creator,
        id: this.formLabelAlign.id,
      };
      let obj2 = {
        ocrRecognitionAccuracy: this.radioOne,
        bibliographicIntegrity: this.radioTwo,
        directoryFormatSpecification: this.radioThree,
        dataId: this.formLabelAlign.id,
      };
      if (this.formLabelAlign.fileType == 1) {
        this.$api.save(obj).then((res) => {
          if (res.code == 200) {
            this.$message({
              message: res.msg,
              type: "success",
            });
            this.goBank();
            if (this.orcDate) {
              this.$api.updateOCRInfo(obj2).then((res) => {
                if (res.code == 200) {
                  this.$message({
                    message: res.msg,
                    type: "success",
                  });
                  this.goBank();
                }
              });
            }
          }
        });
      } else {
        this.$api.save(obj).then((res) => {
          if (res.code == 200) {
            this.$message({
              message: res.msg,
              type: "success",
            });
            this.goBank();
          }
        });
      }
    },
    goBank() {
      this.$router.go(-1);
    },
    getCurrentNode(data, node) {
      this.currentData = data;
      this.currentNode = node;
    },
    handleEidt() {
      if (!this.currentData.labelContent) {
        this.$message({
          type: "warning",
          message: "请先点击左侧列表选择",
        });
        return;
      }
      this.editVal = this.currentData.labelContent;
      this.isShowEditDialog = true;
    },
    async handleSubmitEdit() {
      let fileType = this.$route.query.type;
      let kind = 0;
      if (fileType == ".doc" || fileType == ".docx") {
        kind = 0;
      } else if (fileType == ".pdf") {
        kind = 1;
      }
      let params = {
        file_id: this.currentData.file_id,
        kind, // 0为word文件，1为pdf文件
        uuid: this.currentData.uuid,
        type: this.currentData.type,
        content: this.editVal,
      };
      let res = await this.$api.editContent(params);
      if (res.state == 200) {
        this.$message({
          type: "success",
          message: res.msg,
        });
        // 刷新节点
        this.currentNode.parent.loaded = false;
        this.currentNode.parent.loadData();
        this.isShowEditDialog = false;
        this.currentData = {};
        this.currentNode = {};
      } else {
        this.$message({
          type: "error",
          message: res.msg,
        });
      }
    },
    handleDelet() {
      if (!this.currentData.labelContent) {
        this.$message({
          type: "warning",
          message: "请先点击左侧列表选择",
        });
        return;
      }
      this.$confirm("是否确认删除？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let fileType = this.$route.query.type;
          let kind = 0;
          if (fileType == ".doc" || fileType == ".docx") {
            kind = 0;
          } else if (fileType == ".pdf") {
            kind = 1;
          }
          let apiName = "";
          if (this.currentData.type == -1) {
            // 正文
            apiName = "delete_text";
          } else {
            apiName = "delete_title";
          }

          let params = {
            file_id: this.currentData.file_id,
            kind, // 0为word文件，1为pdf文件
            uuid: this.currentData.uuid,
          };
          this.$api[apiName](params)
            .then((res) => {
              if (res.state == 200) {
                this.$message({
                  type: "success",
                  message: res.msg,
                });
                // 刷新节点
                this.currentNode.parent.loaded = false;
                this.currentNode.parent.loadData();
                this.isShowEditDialog = false;
                this.currentData = {};
                this.currentNode = {};
              } else {
                this.$message({
                  type: "error",
                  message: res.msg,
                });
              }
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    handleAdd() {
      if (!this.currentData.labelContent) {
        this.$message({
          type: "warning",
          message: "请先点击左侧列表选择",
        });
        return;
      }
      this.addVal = "";
      this.addRadio = "";
      this.isShowAddDialog = true;
    },
    handleSubmitAdd() {
      if (!this.addVal) {
        this.$message({
          type: "warning",
          message: "请输入内容",
        });
        return;
      }
      if (!this.addRadio) {
        this.$message({
          type: "warning",
          message: "请选择添加类型",
        });
        return;
      }
      if (this.currentData.type == -1) {
        this.handleSubmitAddContent();
      } else {
        this.handleSubmitAddTitle();
      }
    },
    handleSubmitAddContent() {
      let fileType = this.$route.query.type;
      let kind = 0;
      if (fileType == ".doc" || fileType == ".docx") {
        kind = 0;
      } else if (fileType == ".pdf") {
        kind = 1;
      }
      // 正文
      let params = {
        file_id: this.currentData.file_id,
        kind,
        uuid: this.currentData.uuid,
        content: this.addVal,
        direction: Number(this.addRadio) - 1,
        order: this.currentData.order,
        parent_id: this.currentData.parent_id,
      };
      this.$api
        .add_text(params)
        .then((res) => {
          if (res.state == 200) {
            this.$message({
              type: "success",
              message: res.msg,
            });
            // 刷新节点
            this.currentNode.parent.loaded = false;
            this.currentNode.parent.loadData();
            this.isShowAddDialog = false;
            this.currentData = {};
            this.currentNode = {};
          } else {
            this.$message({
              type: "error",
              message: res.msg,
            });
          }
        })
        .catch((err) => {
          {
            this.$message({
              type: "error",
              message: err.msg,
            });
          }
        });
    },
    handleSubmitAddTitle() {
      // kind
      let fileType = this.$route.query.type;
      let kind = 0;
      if (fileType == ".doc" || fileType == ".docx") {
        kind = 0;
      } else if (fileType == ".pdf") {
        kind = 1;
      }
      // obj
      let obj = JSON.parse(JSON.stringify(this.currentData));
      delete obj.labelContent;
      delete obj.leaf;
      // direction
      let direction = 0;
      let contentType = 0;
      if (this.addRadio == 3) {
        direction = 1;
        contentType = 1;
      } else {
        direction = Number(this.addRadio) - 1;
        contentType = 0;
      }
      // 标题
      let params = {
        info: obj,
        kind,
        content: this.addVal,
        direction,
        content_type: contentType,
      };
      this.$api
        .add_title(params)
        .then((res) => {
          if (res.state == 200) {
            this.$message({
              type: "success",
              message: res.msg,
            });
            // 刷新节点
            this.currentNode.parent.loaded = false;
            this.currentNode.parent.loadData();
            this.isShowAddDialog = false;
            this.currentData = {};
            this.currentNode = {};
          } else {
            this.$message({
              type: "error",
              message: res.msg,
            });
          }
        })
        .catch((err) => {
          {
            this.$message({
              type: "error",
              message: err.msg,
            });
          }
        });
    },
    handleChangeLevel() {
      if (!this.currentData.labelContent) {
        this.$message({
          type: "warning",
          message: "请先点击左侧列表选择",
        });
        return;
      }
      if (this.currentData.type == -1) {
        this.$message({
          type: "warning",
          message: "请选择标题进行修改",
        });
        return;
      }
      this.isShowChangeLevelDialog = true;
    },
    getChangeCurrentNode(data, node) {
      this.changeCurrentData = data;
      this.changeCurrentNode = node;
    },
    getUpCheckedNode(data, node) {
      this.upCheckedNode = node;
    },
    handleSubmitChangeLevel() {
      if (!this.changeCurrentData.labelContent) {
        this.$message({
          type: "warning",
          message: "请先选择标题",
        });
        return;
      }
      if (this.changeCurrentData.type == -1) {
        this.$message({
          type: "warning",
          message: "请选择标题进行修改",
        });
        return;
      }
      let nodeFirst = this.currentNode;
      let nodeSecond = this.changeCurrentNode;
      if (nodeFirst.data.uuid == nodeSecond.data.uuid) {
        this.$message({
          type: "warning",
          message: "请勿选择相同标题",
        });
        return;
      }
      // kind
      let fileType = this.$route.query.type;
      let kind = 0;
      if (fileType == ".doc" || fileType == ".docx") {
        kind = 0;
      } else if (fileType == ".pdf") {
        kind = 1;
      }
      if (nodeFirst.level <= nodeSecond.level) {
        // 降级
        let params = {
          file_id: nodeFirst.data.file_id,
          kind,
          current_uuid: nodeFirst.data.uuid,
          parent_id: nodeSecond.data.uuid,
        };
        this.$api
          .title_demotion(params)
          .then((res) => {
            if (res.state == 200) {
              this.$message({
                type: "success",
                message: res.msg,
              });
              // 刷新节点
              this.$refs.tree.root.loaded = false;
              this.$refs.tree.root.expand();
              this.currentData = {};
              this.currentNode = {};
              this.changeCurrentData = {};
              this.changeCurrentNode = {};
              this.isShowChangeLevelDialog = false;
            } else {
              this.$message({
                type: "error",
                message: res.msg,
              });
            }
          })
          .catch((err) => {
            {
              this.$message({
                type: "error",
                message: err.msg,
              });
            }
          });
      } else {
        // 升级
        let treeParams = {
          file_id: nodeFirst.data.file_id,
          uuid: nodeSecond.data.uuid,
        };
        let apiName = "";
        if (kind == 1) {
          apiName = "get_pdf_info";
        } else {
          apiName = "get_word_info";
        }
        this.$api[apiName](treeParams)
          .then((res) => {
            if (res.state == 200) {
              let computedListArr = res.data.filter((item) => {
                return item.type != -1;
              });
              if (computedListArr.length) {
                computedListArr.forEach((item) => {
                  item.labelContent = item.title ? item.title : item.text;
                });
                this.upCheckOrderTableData = computedListArr;
              } else {
                this.upCheckOrderTableData = [
                  JSON.parse(JSON.stringify(this.changeCurrentNode.data)),
                ];
                this.upCheckOrderTableData[0].order = 1;
              }
              this.isShowUpCheckOrderDialog = true;
            } else {
              this.$message({
                type: "error",
                message: res.msg,
              });
            }
          })
          .catch((err) => {
            {
              this.$message({
                type: "error",
                message: err.msg,
              });
            }
          });
      }
    },
    handleUpSubmit() {
      if (!this.upCheckedNode.data.labelContent) {
        this.$message({
          type: "warning",
          message: "请先点击选择插入的顺序",
        });
        return;
      }
      // kind
      let fileType = this.$route.query.type;
      let kind = 0;
      if (fileType == ".doc" || fileType == ".docx") {
        kind = 0;
      } else if (fileType == ".pdf") {
        kind = 1;
      }
      let params = {
        file_id: this.currentNode.data.file_id,
        kind,
        current_uuid: this.currentNode.data.uuid,
        parent_id: this.changeCurrentNode.data.uuid,
        location: this.upCheckedNode.data.order,
      };
      this.$api
        .title_up(params)
        .then((res) => {
          if (res.state == 200) {
            this.$message({
              type: "success",
              message: res.msg,
            });
            this.isShowUpCheckOrderDialog = false;
            this.$refs.tree.root.loaded = false;
            this.$refs.tree.root.expand();
            this.currentData = {};
            this.currentNode = {};
            this.changeCurrentData = {};
            this.changeCurrentNode = {};
            this.upCheckedNode = {};
            this.isShowChangeLevelDialog = false;
          } else {
            this.$message({
              type: "error",
              message: res.msg,
            });
          }
        })
        .catch((err) => {
          {
            this.$message({
              type: "error",
              message: err.msg,
            });
          }
        });
    },
    loadNodeChangeLevel(node, resolve) {
      let fileType = this.$route.query.type;
      if (fileType == ".doc" || fileType == ".docx") {
        if (node.level === 0) {
          let obj = {
            file_id: this.$route.query.row,
          };
          this.$api
            .get_word_title(obj)
            .then((res) => {
              res.data.leaf = false;
              res.data.labelContent = res.data.title;
              return resolve([res.data]);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
        if (node.level >= 1) {
          let obj2 = {
            file_id: node.data.file_id,
            uuid: node.data.uuid,
          };
          this.$api
            .get_word_info(obj2)
            .then((res) => {
              res.data.forEach((item, i) => {
                let type = item.type == -1 ? true : false;
                item.leaf = type;
                item.labelContent = item.title ? item.title : item.text;
              });
              let computedListArr = res.data.filter((item) => {
                return item.type != -1;
              });
              return resolve(computedListArr);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
      } else if (fileType == ".pdf") {
        if (node.level === 0) {
          let obj = {
            file_id: this.$route.query.row,
          };
          this.$api
            .get_pdf_title(obj)
            .then((res) => {
              res.data.forEach((item) => {
                let type = !item.text_flag == 1;
                item.leaf = type;
                item.labelContent = item.title;
              });
              return resolve(res.data);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
        if (node.level >= 1) {
          let obj2 = {
            file_id: node.data.file_id,
            uuid: node.data.uuid,
          };
          this.$api
            .get_pdf_info(obj2)
            .then((res) => {
              res.data.forEach((item) => {
                let type = item.type == -1 ? true : false;
                item.leaf = type;
                item.labelContent = item.title ? item.title : item.text;
              });
              let computedListArr = res.data.filter((item) => {
                return item.type != -1;
              });
              return resolve(computedListArr);
            })
            .catch((err) => {
              {
                this.$message({
                  type: "error",
                  message: err.msg,
                });
              }
            });
        }
      }
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/css/mixin.scss";
@import "@/css/flex.scss";
.fielDetail {
  overflow: hidden;
  padding-bottom: 50px;
  height: 100%;
  .orc {
    cursor: pointer;
  }
  .el-form-item {
    margin-bottom: 10px;
  }
  //头部
  .info-top {
    margin-top: 20px;
    margin-left: 30px;
    .info-top-left {
      .line {
        width: 4px;
        height: 20px;
        background: #3386fe;
        opacity: 1;
        border-radius: 0px;
        float: left;
        margin-top: 2px;
      }
      .fileinfo {
        margin-left: 10px;
        width: 88px;
        height: 30px;
        font-size: 22px;
        font-family: Source Han Sans CN;
        font-weight: bold;
        line-height: 0px;
        color: #1a2e44;
        opacity: 1;
      }
    }
    .info-top-right {
      float: right;
      margin-top: -10px;
      margin-right: 23px;
    }
  }
  //中间
  .info-center {
    margin-left: 37px;
    position: relative;
  }
  .treeNode {
    width: 600px;
    text-align: left;
    margin-top: 10px;
    .text {
      margin-bottom: 20px;
    }
    .oneNode {
      font-size: 26px;
      font-weight: 500;
      .TwoNode {
        font-size: 22px;
        font-weight: 500;
        margin-left: 60px;
        .threeNode {
          font-size: 18px;
          font-weight: 500;
          margin-left: 60px;
        }
      }
    }
  }
  //底部
  .edit-box {
    position: absolute;
    right: 23px;
    top: 0;
    .btn-box {
      margin-bottom: 20px;
    }
  }
}
</style>

<style lang="scss">
//-start--这句话最好设置在公共样式里面，要不不生效
.el-tree-node__content {
  height: auto !important;
}
//-end--这句话最好设置在公共样式里面，要不不生效

.onlyThree {
  width: 100%;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis; //显示为省略号
  white-space: nowrap; //不换行
  text-align: left;
  span {
    white-space: pre-wrap;
  }
}
.onlyThreeActive {
  width: 100%;
  font-size: 16px;
  overflow: hidden;
  text-overflow: ellipsis; //显示为省略号
  white-space: nowrap; //不换行
  text-align: left;
  span {
    white-space: pre-wrap;
  }
}

.fielDetail,
.edit-dialog-box {
  .el-tree-node__content:hover,
  .el-tree--highlight-current
    .el-tree-node.is-current
    > .el-tree-node__content {
    background-color: #c3defb;
  }
  .el-tree-node:focus > .el-tree-node__content {
    background-color: transparent;
  }
}

.edit-dialog-box {
  .edit-dialog-content {
    padding: 30px;
    border-top: 1px solid #d8d8d8;
  }
  .btn-box {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
  }
  .radio-box {
    margin-bottom: 20px;
  }
  .tree-scroll-box {
    height: 300px;
    .el-scrollbar__wrap {
      overflow: auto;
    }
    .el-tree {
      height: 100%;
    }
  }
}
</style>
